 .container {
            width: 1170px;
            margin: 0 auto;
        }

        .header-top {
            width: 100%;
            height: 30px;
            background-color: #f5f5f5;
        }

        .header {
            padding: 0 10px;
            font-size: 12px;
            line-height: 30px;
        }

        .header-left {
            float: left;
            color: #555;
            width: 70px;
            text-align: center;
            position: relative;
        }

        .header-right {
            float: right;
            display: flex;
            color: #666;
            position: relative;
        }

        .header-right li {
            color: #ebebeb;
            height: 30px;
        }

        .header a:hover {
            color: #f10180;
        }

        .header-right li a {
            padding: 0 15px;
            color: #666;
        }

        .sp1 {
            display: inline-block;
            width: 0;
            height: 0;
            border-top: 6px solid #999;
            border-left: 6px solid transparent;
            border-right: 6px solid transparent;
            position: relative;
            left: 15px;
        }

        .a .sp2 {
            display: inline-block;
            width: 0;
            height: 0;
            border-top: 4px solid #999;
            border-left: 4px solid transparent;
            border-right: 4px solid transparent;
            position: relative;
            left: 3px;
        }

        .header_sign {
            position: relative;
            left: -2px;
            top: 1px;
        }

        .header-1 {
            display: inline-block;
            width: 15px;
            height: 18px;
            background-image: url('../img/header.png');
            background-position: -98px -146px;
            position: relative;
            top: 2px;
            left: -2px;
        }

        .header-1:hover {
            background-position: -123px -146px;
        }

        .section {
            width: 68px;
            height: 5px;
            position: absolute;
            left: 1px;
            top: -2px;
            background-color: #fff;
        }

        .section2 {
            width: 71px;
            height: 5px;
            position: absolute;
            left: 1px;
            top: -2px;
            background-color: #fff;
        }

        .section3 {
            width: 91px;
            height: 5px;
            position: absolute;
            left: 1px;
            top: -2px;
            background-color: #fff;
        }

        .section6 {
            width: 86px;
            height: 5px;
            position: absolute;
            right: 1px;
            top: -2px;
            background-color: #fff;
        }

        .section7 {
            width: 62px;
            height: 5px;
            position: absolute;
            right: 1px;
            top: -2px;
            background-color: #fff;
        }

        .section9 {
            width: 134px;
            height: 5px;
            position: absolute;
            right: 1px;
            top: -2px;
            background-color: #fff;
        }

        .box {
            text-align: left;
            border: 1px solid #ccc;
            top: 28px;
            left: -1px;
            position: absolute;
            background-color: white;
            z-index: 100;
            visibility: hidden;
        }

        .box-1 {
            width: 230px;
            padding: 5px 10px;
        }

        h4 {
            font-size: 14px;
            border-bottom: 1px dashed #999;
        }

        .a {
            position: relative;
            border-left: 1px solid transparent;
            border-right: 1px solid transparent;
        }

        .a:hover {
            background-color: #fff;
            border-left: 1px solid #ccc;
            border-right: 1px solid #ccc;
        }

        .a:hover .sp1 {
            border-top: 6px solid #f10180;
            transform: rotate(180deg);
        }

        .a:hover .sp2 {
            border-top: 4px solid #f10180;
            transform: rotate(180deg);
        }

        .a:hover .box {
            visibility: visible;
        }

        .box-2 {
            width: 250px;
            padding: 20px 10px;
        }

        .header-2 {
            display: inline-block;
            background-image: url('../img/header.png');
            width: 40px;
            height: 40px;
            background-position: -1px 65px;
        }

        .box-2 p {
            display: inline-block;
            border-bottom: 1px dashed #999;
            position: relative;
            top: -20px;
        }

        .denglu {
            display: flex;
            flex-wrap: wrap;
        }

        .denglu li {
            width: 40%;
        }

        .box-3 {
            width: 130px;
        }

        .box-4 {
            width: 105px;
            border-top: none;
        }

        .box-5 {
            width: 93px;
            border-top: none;
        }

        .box-6 {
            position: absolute;
            border: 1px solid #ccc;
            top: 28px;
            padding: 10px;
            text-align: center;
            left: -84px;
            height: 200px;
            background-color: white;
        }

        .box-6 a {
            color: #000;
            font-size: 14px;
            position: relative;
            bottom: -125px;
        }

        .qr {
            width: 150px;
        }

        .box-7 {
            position: absolute;
            width: 300px;
            border: 1px solid #ccc;
            top: 28px;
            padding: 10px;
            left: -237px;
            text-align: left;
            background-color: white;
        }

        .box-7 div {
            border-bottom: 1px dashed #ccc;
            padding: 10px 0;
            margin-bottom: 10px;
        }

        .box-7 h5 {
            padding-left: 14px;
            color: #000;
            font-size: 14px;
        }

        .box-8 {
            position: absolute;
            width: 400px;
            border: 1px solid #ccc;
            top: 28px;
            color: #666;
            padding-top: 30px;
            padding-left: 40px;
            padding-right: 10px;
            left: -20px;
            background-color: white;
            visibility: hidden;
            z-index: 100;
        }

        .b:hover .box-8 {
            visibility: visible;
        }

        .box-8 .header-3 {
            display: inline-block;
            height: 40px;
            background-image: url('../img/header.png');
            background-position: -48px -200px;
            position: relative;
            margin-left: -7px;
            text-align: center;
        }

        .box-8 span a {
            position: relative;
            bottom: -15px;
            left: -10px;
        }

        .box-8 div {
            display: inline-block;
            width: 30px;
            border: 1px solid #ccc;
            position: relative;
            top: -11px;
            margin-left: -30px;
        }

        .qiandao {
            width: 300px;
            text-align: left;
            border-top: 1px solid #ccc;
            margin: 20px 0;
            padding: 5px 0;
        }

        .qiandao a {
            position: relative;
            left: -15px;
            text-decoration: underline;
        }

        .button {
            float: right;
            width: 60px;
            height: 25px;
            background-color: #f10180;
            border-radius: 3px;
            font-size: 14px;
            position: relative;
            bottom: -5px;
            line-height: 25px;
            text-align: center;
            color: white;
        }

        .header-4 {
            display: inline-block;
            width: 12px;
            height: 10px;
            background-image: url('../img/header.png');
            background-position: -105px -30px;
            position: absolute;
            top: -7px;
            left: 190px;
        }
        /*--------------------------logo--------------------------  */

        .logo img {
            width: 250px;
            height: 100px;
        }

        .vip {
            display: flex;
            justify-content: space-between;
        }

        .vip-right {
            display: flex;
            height: 100px;
        }

        .vip-right img {
            width: 126px;
            height: 100px;
        }

        .header-5 {
            display: inline-block;
            width: 28px;
            height: 28px;
            background-image: url('../img/header.png');
            background-position: 0 -60px;
            position: relative;
            top: 10px;
            margin-left: 15px;
        }

        .shopping {
            color: #ccc;
            font-size: 5px;
        }

        .shopping div {
            width: 136px;
            height: 46px;
            display: inline-block;
            position: relative;
            top: 27px;
            text-align: left;
            border-top: 1px solid transparent;
            border-left: 1px solid transparent;
            border-right: 1px solid transparent;
            margin-left: 5px;
        }

        .shopping a {
            color: #666;
            font-size: 12px;
        }

        .shopping a:hover {
            color: #f10180;
        }

        .sp0 {
            display: inline-block;
            width: 25px;
            height: 15px;
            background-color: #f10180;
            border-radius: 10px;
            position: absolute;
            color: #000;
            text-align: center;
            left: 7px;
            top: -6px;
        }

        .sp00 {
            position: absolute;
            /* top: -24px; */
            left: 10px;
            color: white;
        }

        .box-9 {
            position: absolute;
            width: 300px;
            padding: 30px;
            border: 1px solid #ccc;
            top: 42px;
            left: -165px;
            color: #444;
            visibility: hidden;
            background-color: white;
            z-index: 100;
        }

        .shopping-div:hover {
            background-color: white;
            border-top: 1px solid #ccc;
            border-left: 1px solid #ccc;
            border-right: 1px solid #ccc;
        }

        .shopping-div:hover .box-9 {
            visibility: visible;
        }

        .box-9 a {
            color: #f10180;
        }
        /*-----------------------------导航-------------------------------------  */

        nav {
            width: 100%;
            height: 40px;
            background-color: #f10180;
            line-height: 40px;
            color: white; 
            transition: all 0.5s linear;
            z-index: 200;
        }

        .nav-left {
            float: left;
            display: flex;
        }

        .nav-main {
            padding: 0 15px;
        }

        .nav-main>li {
            height: 40px;
        }

        .nav-main li:hover {
            background-color: rgba(0, 0, 0, 0.1);
        }

        .nav-main a {
            padding: 0 20px;
        }

        .nav-right {
            float: right;
            display: flex;
        }

        .nav-right img {
            /* display: inline-block; */
            vertical-align: middle;
            position: relative;
            left: -5px;
            top: -2px;
        }

        .more .sp2 {
            border-top: 4px solid #fff;
            display: inline-block;
            width: 0;
            height: 0;
            border-left: 4px solid transparent;
            border-right: 4px solid transparent;
            position: relative;
            left: 3px;
        }

        .more {
            position: relative;
        }

        .more:hover .sp2 {
            transform: rotate(180deg);
        }

        .more:hover .box-10 {
            visibility: visible;
        }

        .yugao {
            font-size: 8px;
            color: #999;
        }
        /* ----------更多----------  */

        .box-10 {
            position: absolute;
            width: 558px;
            max-height: 335px;
            box-shadow: 0 0 3px 3px rgba(0, 0, 0, 0.1);
            padding: 26px 11px;
            right: 0;
            visibility: hidden;
            background-color: #fff;
            z-index: 5;
        }

        .box-10 li {
            width: 170px;
            height: 96px;
            display: inline-block;
            vertical-align: top;
            margin: 0 5px 10px 0;
            z-index: 1;
            position: relative;
            overflow: hidden;
        }

        .box-10 img {
            border-radius: 4px;
        }

        .box-10 li a {
            width: 100%;
            height: 100%;
            padding: 0;
        }

        .shadow {
            width: 100%;
            height: 96px;
            background: linear-gradient(to bottom, rgba(0, 0, 0, 0) 0, rgba(0, 0, 0, .9) 100%);
            transition: all .5s ease;
            position: absolute;
            left: 0;
            top: 38px;
            z-index: 2;
        }

        .box-10-div {
            position: absolute;
            color: #fff;
            font-size: 16px;
            text-align: center;
            width: 100%;
            height: 20px;
            bottom: 15px;
            z-index: 3;
            transition: all .5s ease;
        }

        .box-10 li:hover .shadow {
            top: 0px;
        }

        .box-10 li:hover .box-10-div {
            transform: translate(0, -30px);
        }
        /*-------------------------------------------------轮播  */

        .lunbo {
            height: 500px;
            background-image: url('../img/lunbo_bg.jpg');
            padding-top: 30px;
            padding-bottom: 20px;
            margin-bottom: 10px;
            position: relative;
        }

        .lunbo-list {
            height: 450px;
            margin: 0 auto;
            padding: 12px;
            padding-bottom: 0;
            background: rgba(255, 255, 255, .86);
            position: relative;
            margin: 0 auto;
            box-shadow: 0 1px 3px rgba(167, 167, 167, .4);
            overflow: hidden;
        }

        .lunbo-list li {
            display: none;
        }

        .lunbo-list .current {
            display: block;
        }

        .lunbo-bottom {
            width: 1146px;
            margin: 0 auto;
            display: flex;
            position: absolute;
            bottom: 30px;
            left: 570px;
            color: #999;
            font-size: 8px;
        }

        .lunbo-bottom li {
            padding: 0 20px;
            font-size: 12px;
            color: #666;
        }

        .hua {
            width: 182px;
            height: 3px;
            background-color: #f10180;
            position: absolute;
            left: 0;
            bottom: -13px;
            transition: all 0.3s linear;
        }

        .lunbo-bottom .active {
            color: #222;
        }

        .prev,
        .next {
            position: absolute;
            width: 50px;
            height: 100px;
            background-color: rgba(0, 0, 0, 0.3);
            color: #fff;
            font-size: 40px;
            text-align: center;
            line-height: 100px;
            top: 180px;
            border-radius: 5px;
            transition: all 0.3s linear;
        }

        .lunbo-list:hover .prev{
            left: 10px;
        }
        .lunbo-list:hover .next{
            right: 10px;
        }
        .next:hover,
        .prev:hover {
            background-color: rgba(0, 0, 0, 0.8);
        }

        .prev {
            left: -50px; 
            cursor: pointer;
        }

        .next {
            right:-50px; 
            cursor: pointer;
        }
        /* ***********************************************************  */

        .hot {
            height: 180px;
            background-image: url('../img/bg_v3.jpg');
        }

        .hot div {
            display: inline-block;
            float: right;
            margin: 20px 10px;
            width: 165px;
            height: 145px;
            position: relative;
        }

        .hot div img {
            width: 165px;
            height: 145px;
        }

        .hot .top1 {
            margin-right: 30px;
        }

        .hot span {
            display: inline-block;
            width: 40px;
            height: 45px;
            position: absolute;
            right: -10px;
            top: -10px;
            background-image: url('../img/icon.png');
        }

        .hot .icon-3 {
            background-position: 0 0;
        }

        .hot .icon-2 {
            background-position: 0 -50px;
        }

        .hot .icon-1 {
            background-position: 0 -100px;
        }
        /* ------------------------------侧边栏-------------------------------------  */

        aside {
            position: fixed;
            right: 0;
            top: 0;
            width: 35px;
            bottom: 0;
            background-color: #262626;
            color: white;
            text-align: center;
        }

        .aside {
            width: 100%;
            height: 100%;
            background-color: #262626;
            z-index: 1;
        }

        .aside-1 {
            background-color: #262626;
            padding-top: 230px;
        }

        .aside-2 {
            background-color: #262626;
        }

        aside div {
            position: relative;
        }

        .aside-1 p {
            font-size: 14px;
        }

        .aside-2 .fa,
        .aside-1 .fa {
            font-size: 20px;
        }

        .info-1 {
            height: 55px;
            margin-bottom: 2px;
        }

        .info-1 .fa {
            position: relative;
            bottom: -7px;
        }

        .info-1 p {
            position: relative;
            bottom: -7px;
        }

        .info-2 {
            height: 150px;
            width: 100%;
            background-color: #df147f;
            padding-top: 10px;
        }

        .sprite-1 {
            display: inline-block;
            width: 35px;
            height: 36px;
            background-image: url('../img/sprite.png');
            background-position: -80px -130px;
        }

        .yuan {
            width: 20px;
            height: 20px;
            border-radius: 50%;
            background-color: white;
            color: #df147f;
            position: relative;
            bottom: -10px;
            left: 8px;
        }

        .info {
            width: 100%;
            height: 36px;
            line-height: 36px;
            margin: 5px 0;
        }

        .info:hover {
            background-color: #df147f;
        }

        .aside-2 {
            position: absolute;
            bottom: 20px;
        }

        .info-7 {
            width: 35px;
            height: 36px;
        }

        .info-8 {
            width: 35px;
            height: 36px;
        }
        /* _____________________________________________  */

        .info-1-left {
            position: absolute;
            background-color: white;
            box-shadow: 0 0 3px 3px rgba(0, 0, 0, 0.1);
            padding: 15px 0;
            color: #666;
            width: 250px;
            top: 0;
            right: -250px;
            transition: all 0.3s linear;
            z-index: -1;
        }

        .info-7-left,
        .info-8-left {
            z-index: -1;
        }

        .info-1 .info-1-left p {
            font-size: 12px;
        }

        .info-1 .info-1-left p a {
            color: #df147f;
        }

        .close {
            position: absolute;
            right: 15px;
        }

        .close img {
            width: 13px;
            height: 13px;
        }

        .login {
            /* border: 1px solid  #eee; */
            box-shadow:  0 0 2px 2px rgba(0, 0, 0, 0.1);
            margin-top: 20px;
            display: inline-block;
            padding: 5px;
            background-image: url('../img/header.png');
            width: 40px;
            height: 40px;
            background-position: -1px 65px;
        }

        .sec {
            width: 100%;
            height: 100px;
            background-color: #eee;
            border-top: 1px solid #ccc;
            border-bottom: 1px solid #ccc;
            margin-top: 20px;
            display: flex;
            align-items: center;
        }

        .dingdan {
            width: 49.9%;
            height: 60%;
            border-right: 1px solid #ccc;
        }

        .xiaoxi {
            width: 49.9%;
            height: 60%;
        }

        .info-1 .info-1-left .sec .fa {
            font-size: 27px;
        }

        .xiaoxi:hover,
        .dingdan:hover {
            color: #df147f;
        }

        .clue {
            padding-right: 15px;
        }

        .aside .info-left {
            position: absolute;
            background-color: white;
            box-shadow: 0 0 3px 3px rgba(0, 0, 0, 0.1);
            top: 0;
            right: -155px;
            width: 120px;
            height: 36px;
            color: #666;
            font-size: 14px;
            line-height: 36px;
            transition: all 0.3s linear;
            z-index: -1;
        }

        .info-3:hover .info-3-left {
            right: 35px;
        }

        .info-4:hover .info-4-left {
            right: 35px;
        }

        .info-5:hover .info-5-left {
            right: 35px;
        }

        .info-6:hover .info-6-left {
            right: 35px;
        }

        .info-7:hover .info-7-left {
            right: 35px;
        }

        .info-8:hover .info-8-left {
            right: 35px;
        }